<style scoped>
    body,a,span{
      font-family: 'Lato', 'Open Sans', Helvetica, sans-serif !important;
    }
    .platform-main-header{
        box-sizing: border-box;
        position: fixed;
        display: block;
        width: 100%;
        padding-left: 200px;
        height: 100px;
        z-index: 20;
        box-shadow: 0 2px 3px -2px rgba(0, 0, 0, 0.15);
        transition: padding .3s;
    }
    .main-header{
        height: 60px;
        background: #fff;
        box-shadow: 0 2px 3px rgba(0,0,0,.10);
        position: relative;
        z-index: 11;
    }
    .main-tags{
        height: 40px;
        z-index: -1;
        overflow: hidden;
        background: #f9f9f9;
    }
    .platform-main-body{
        position: absolute;
        top: 100px;
        right: 0;
        bottom: 0;
        overflow: auto;
        background-color: #fafafa;
        z-index: 1;
        transition: left .3s;
        left: 200px;
    }
    .platform-main-bread{
      /*border-left: 1px solid #ddd;*/
      padding-left: 10px;
    }
    .platform-main-bread li{
      font-family: "Ionicons";
      display: inline-block;
    }
    .platform-main-bread a{
      color: #585a5a;
      font-weight: 500;
      font-size: 8px;
    }
    .platform-main-bread>ul>li+li:before{
      padding: 0 5px;
      color: #868e96;
      content: "\F3D3";
      margin-right: 3px;
    }
    .platform-main-body-header{
      margin-bottom: 10px;
      border-bottom: 1px solid #eeeeee;
    }
    .setting{
      position: absolute;
      top: 8px;
      right: 8px;

    }
</style>
<template>
    <div class="platform-main">
        <div class="platform-main-header">
            <!--头部导航栏-->
            <div class="main-header">
                <main-header></main-header>
            </div>
            <main-tags></main-tags>
        </div>
            <!--侧边栏单文件-->
            <main-sidebar></main-sidebar>
        <div style="padding:15px;" class="platform-main-body">
          <div class="platform-main-body-header">
            <div class="platform-main-bread">
              <ul>
                <li @click="breadClick('dashboard','首页')"><a><Icon style="font-size:10px" type="ios-home"></Icon> &nbsp;首页</a></li>
                <li @click="breadClick(bread.href,bread.name)" v-for="bread in breadList"><a>{{bread.name}}</a></li>
              </ul>
            </div>
            <div class="setting">
              <Button type="primary">设置 &nbsp;<Icon type="chevron-down"></Icon></Button>
            </div>
          </div>
            <!--内容区块（保持缓存）-->
            <keep-alive>
                <router-view></router-view>
            </keep-alive>
        </div>
    </div>
</template>
<script>
    import mainSidebar from './component/main-sidebar.vue';
    import mainHeader from './component/main-header.vue';
    import mainTags from './component/main-tags.vue';

    export default {
        data:function(){
            return{
              breadList:[]
            }
        },
        components:{
            mainSidebar,
            mainTags,
            mainHeader
        },
        computed:{
          currentPagePath (){
            return this.$store.state.currentPath;
          },
          currentPageName (){
            return this.$store.state.currentPageName;
          },
          breadName(){
            return this.$store.state.breadPath;
          }
        },
        watch:{
          currentPagePath(val){
            this.$router.push(val);
          },
          currentPageName(val){
            this.$store.commit('setbreadNav',val);
          },
          breadName(val){
            this.breadList = val;
          }
        },
        methods: {
            breadClick(routeVal,name){
              this.$router.push(routeVal);
              if(routeVal!=''){
                this.$store.commit('setCurrentPage',name);
              }
            }
        }
    };
</script>*/
